        /* 
            可以通过改变 [--default --checked  --later] 修改竖线和圆形颜色

            css3变量：  注意1、需要在使用css的父级声明, 2、需要用 --开头
            var(--default,$f00) 
            var(--自定义名,自定义无效时显示的颜色) 
         */
        * {
            margin: 0; padding: 0;
            --default:#00AACC; /*默认*/
            /* --checked:#66D533;*/ /*当前选中的*/
            --checked:#00AACC; /*当前选中的*/
            --later:#CCD5CC; /*当前选中下面的*/
            /* 字体颜色自行定义 */

        }
        .timeLine {margin: 20px auto 0;overflow: hidden;position: relative}
        .timeLine li { 
            display: flex;
        } 
        .timeLine li .con{ 
            width: calc(100% - 168px);
            background:linear-gradient(to left, var(--default,#00AACC),var(--default,#00AACC)) 7.5px top no-repeat; 
            background-size: 1px 100%;
            position: relative;
            padding:0 30px 0 30px ;
        }
        .timeLine li .con::after{
            content: "";
            width: 15px;
            height: 15px;
            border-radius: 50%;
            border: 1px solid var(--default,#00AACC);
            background: radial-gradient(var(--default,#00AACC) 25%, transparent 30%) 50% 50% no-repeat,
                        linear-gradient(to left, #fff,#fff) left top no-repeat;
            background-size: 100% 100%, 100% 100%;
            position: absolute;
            top: 0;
            left: 0;
        }

        .timeLine li p {width:168px;font-size: 16px;text-align:right;padding:0 20px 20px 0;color:#1296db;}
        .timeLine li p span {display: block;color: #6fceff;font-size: 12px;}

        .timeLine li img{ max-width: 100%;}
       
        .timeLine li:last-child {background:none !important;}

        /* .on  */
        .timeLine li.on .con{
            background:linear-gradient(to left, var(--checked,#66D533),var(--checked,#66D533)) 7.5px top no-repeat; 
            background-size: 1px 100%;
            position: relative;
        }
        .timeLine li.on .con::after{
            content: "";
            border: 1px solid var(--checked,#00AACC);
            background: radial-gradient(var(--checked,#66D533) 25%, transparent 30%) 50% 50% no-repeat,
                        linear-gradient(to left, #fff,#fff) left top no-repeat;
            background-size: 100% 100%, 100% 100%;
        }
        
        .timeLine li.on p {color: #00AACC;}
        .timeLine li.on p span {color: #6fceff;}


        /* .on 下面的li  */
        .timeLine li.on ~ li .con{background:linear-gradient(to left, var(--later,#CCD5CC),var(--later,#CCD5CC)) 7.5px top no-repeat; background-size: 1px 100%;}
        .timeLine li.on ~ li .con::after{
            content: "";
            border: 1px solid var(--later,#CCD5CC);
            background: radial-gradient(var(--later,#CCD5CC) 25%, transparent 30%) 50% 50% no-repeat,
                        linear-gradient(to left, #fff,#fff) left top no-repeat;
            background-size: 100% 100%, 100% 100%;
        }
        .timeLine li.on ~ li p {color: #c3c3c3;}
        .timeLine li.on ~ li a {color: #c3c3c3;}
        .timeLine li.on ~ li p span {color: #d0d0d0;}
        /* 移除最后一个 竖线 */
        .timeLine li:last-child .con{background:none !important;}

        
        .history-panel{margin-top: 5%;}
        .history-panel img {width: 30px; height: 42px;}
        
        .his-del{
			margin-right: 80px;
			padding-top: 10px;
		}
		
        